<template>
    <el-card>
        <model-view :editStatus="editStatus" v-if="dialogVisible" :obj="useData" @closeAction="closeAction"
                    :dialogVisible="dialogVisible"></model-view>
        <el-row>
            <el-form style="margin-top: 10px">
                <el-form-item label="生效时间：" style="width: 320px;float: left">
                    <el-date-picker v-model="date" value-format="yyyy-MM-dd" type="date" style="width: 150px"/>
                </el-form-item>
                <el-form-item style="float: left">
                    <el-button size="mini" type="primary" style="float: left;margin-top:5px;" @click="search">查询
                    </el-button>
                    <el-button size="mini" type="primary" style="float: left;margin-top:5px;" @click="add">新增
                    </el-button>
                    <el-button size="mini" type="primary" style="float: left;margin-top:5px;" @click="delAll">删除选中
                    </el-button>
                </el-form-item>
            </el-form>
        </el-row>
        <el-table :border="true" :stripe="true"
                ref="multipleTable"
                :data="tableData"
                tooltip-effect="dark"
                style="width: 100%"
                @selection-change="handleSelectionChange">
            <el-table-column
                    type="selection"
                    width="55">
            </el-table-column>
            <el-table-column prop="participantName" label="发电企业" align="center"></el-table-column>
            <el-table-column prop="startTime" label="开始时间" align="center"></el-table-column>
            <el-table-column prop="endTime" label="结束时间" align="center"></el-table-column>
            <el-table-column prop="bechPrice" label="标杆电价" align="center"></el-table-column>
            <el-table-column prop="rate" label="标杆电价比例" align="center"></el-table-column>
            <el-table-column prop="checkPrice" label="考核电价" align="center"></el-table-column>
            <el-table-column prop="transPrice" label="通道电价" align="center"></el-table-column>
            <el-table-column prop="transcheckPrice" label="通道考核电价" align="center"></el-table-column>
            <el-table-column prop="tunelRate" label="通道电价比例" align="center"></el-table-column>
            <el-table-column prop="remark" label="备注" align="center"></el-table-column>
            <el-table-column fixed="right" label="操作" width="100" align="center">
                <template slot-scope="scope">
                    <el-button @click.native.prevent="deleteRow(scope.$index, tableData)" type="text" size="small">删除
                    </el-button>
                    <el-button @click.native.prevent="editRow(scope.$index, tableData)" type="text" size="small">编辑
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
    </el-card>
</template>
<script>
    import ModelView from './ModelView';

    export default {
        components: {
            ModelView
        },
        data() {
            return {
                useData: {},
                editStatus: false,
                dialogVisible: false,
                date: new Date(),
                tableData: [{
                    participantName: '类型一',
                    startTime: '2016-05-03',
                    endTime: '2019-11-19',
                    bechPrice: '521',
                    rate: '61%',
                    checkPrice: '1314',
                    transPrice: '521',
                    transcheckPrice: '123',
                    tunelRate: '88%',
                    remark: '这是个备注'
                }, {
                    participantName: '类型一',
                    startTime: '2016-05-03',
                    endTime: '2019-11-19',
                    bechPrice: '521',
                    rate: '61%',
                    checkPrice: '1314',
                    transPrice: '521',
                    transcheckPrice: '123',
                    tunelRate: '88%',
                    remark: '这是个备注'
                }, {
                    participantName: '类型一',
                    startTime: '2016-05-03',
                    endTime: '2019-11-19',
                    bechPrice: '521',
                    rate: '61%',
                    checkPrice: '1314',
                    transPrice: '521',
                    transcheckPrice: '123',
                    tunelRate: '88%',
                    remark: '这是个备注'
                }],
                multipleSelection: []
            };
        },
        methods: {
            search() {
                this.queryParam.pageInfo.pageNum = 1;
                this.queryPage(this.queryParam);
            },
            add() {
                this.dialogVisible = true;
                this.editStatus = false;
                this.useData = {};
            },
            delAll() {
            },
            handleSelectionChange(val) {
                this.multipleSelection = val;
            },
            deleteRow(index, rows) {
                rows.splice(index, 1);
            },
            editRow(index, rows) {
                this.dialogVisible = true;
                this.editStatus = true;
                this.useData = rows[index];
            },

            closeAction() {
                this.dialogVisible = false;
            }
        }
    };
</script>
<style scoped>

</style>